﻿<html>
<head>
    <title></title>    
    <script src="~/js/jquery-1.9.1.js"></script>
    <link href="~/css/screen.css" rel="stylesheet" />        
    <link href="~/js/chosen/chosen.css" rel="stylesheet" />
    <script src="~/js/jquery.validate.js"></script>   
    <script src="~/js/chosen/chosen.jquery.js"></script>    
    <script type="text/javascript">
        $(document).ready(function () {
            $('#clienteAutocomplete').chosen();

            listarProducto("producto", $("#categoria").val());

            $("#categoria").change(function () {
                listarProducto("producto", $("#categoria").val());
            });

            $("#PedidoForm").validate({
                rules: {
                    cantidad: {
                        required: true,
                        minlength: 1,
                        maxlength: 2,
                        number: true,
                        min: 1
                    },
                    especificacion: {
                        maxlength: 50,
                    }
                },
                messages: {
                    cantidad: {
                        required: "Este campo es obligatorio",
                        minlength: "Minimo 1 digito",
                        maxlength: "Maximo 2 digitos",
                        number: "Solo se acepta numero",
                        min: "No se aceptan numero negativos",
                    },
                    especificacion: {
                        maxlength: "Maximo 50 caracteres",
                    }
                },
                submitHandler: function () {
                    $.ajax({
                        url: "/Registros/agregarPedido",
                        data: {
                            idProducto: $("#producto").val(),
                            cantidad: $("#cantidad").val(),
                            especificacion: $("#especificacion").val(),
                        },
                        type: "POST",
                        success:
                        function (respuesta) {
                            if (respuesta == 0) location.reload();
                            else {
                                alert("Este producto ya existe en la lista");
                            }
                        }
                    });
                }
            });

            function listarProducto(updateId, value) {
                $.getJSON("/Registros/getLstProducto?idCategoria=" + value, function (data) {
                    $("#" + updateId).empty();
                    if (data.length > 0) {
                        $.each(data, function (index, producto) {
                            $("#" + updateId).append("<option value=" + producto.idproducto + ">" + producto.descripcion + "</option>");
                        });
                    }
                });
            }

        })

        function eliminarProducto(index) {
            $.ajax({
                url: "/Registros/eliminarPedido",
                data: {
                    index: index,
                },
                type: "POST",
                success:
                function (respuesta) {
                    location.reload();
                }
            });
        }

        function GrabarPedido() {
            var idCliente = $("#clienteAutocomplete").val();
            if (idCliente != 0) {
                $.ajax({
                    url: "/Registros/GrabarPedido",
                    data: {
                        idMesa: $("#mesa").attr("value"),
                        idEmpleado: 1,
                        idCliente: idCliente,
                    },
                    type: "POST",
                    success:
                    function (respuesta) {
                        $(location).attr('href', "www.google.com");
                        //location.reload();
                    }
                });
            } else {
                alert("Falta seleccionar el cliente");
            }
        }

    </script>
</head>
<body>    
    <label id="mesa" value="@ViewBag.mesa.idmesa">@ViewBag.mesa.descripcion</label>
    <br />
    <label>Cliente</label>
    <select data-placeholder="Seleccione un cliente" id="clienteAutocomplete" class="chosen-select" style="width:350px;" tabindex="2">
        <option value="0"></option>
        @foreach (var x in (List<ENTIDADES.Cliente>)ViewBag.lstCLiente)
        {
            <option value="@x.idcliente">@x.ap_paterno @x.ap_materno, @x.nombres</option>                          
        }        
    </select>
    <br />
    <br />
    <form method="get" id="PedidoForm">
        <label >Categoria</label>                    
        <select name="categoria" id="categoria">            
        @foreach (var x in (List<ENTIDADES.Categoria>)ViewBag.listadoCategoria)
        {
            <option value="@x.idcategoria">@x.descripcion</option>                          
        }        
        </select>
                
        <label >Producto</label>                    
        <select name="producto" id="producto">
        </select>
                  
        <label>Cantidad</label>                    
        <input id="cantidad" name="cantidad" type="text" value="1"/>    

        <label>Especificaciones</label>                          
        <textarea id="especificacion" name="especificacion"></textarea>    
                
        <button type="submit">Agregar</button>                                      
    </form>

    @{        
        if (Session["pedido"] == null)
        {
        <label>No se a agregado productos al pedido</label>
        }
        else
        {
            List<ENTIDADES.DetallePedido> Lista = (List<ENTIDADES.DetallePedido>)Session["pedido"];
            if(Lista.Count()!=0){
                int index = 0;            
                <table>
                    <thead>
                        <tr>
                            <th></th>
                            <th>PRODUCTO</th>
                            <th>CANTIDAD</th>
                            <th>ESPECIFICACIONES</th>
                            <th></th>
                        </tr>
                    </thead>
                    <tbody>                
                        @foreach (var x in (List<ENTIDADES.DetallePedido>)Session["pedido"])
                        {                                     
                        <tr>
                            <td>@(index + 1)</td>
                            <td>@x.objProducto.descripcion</td>
                            <td>@x.cantidad</td>
                            <td>@x.especificacion</td>
                            <td><img src="~/img/cross.png" style="cursor:pointer;" onclick="eliminarProducto(@index)" /></td>
                        </tr>
                            index++;
                        }
                    </tbody>
                </table>
                <img src="~/img/Check.png" onclick="GrabarPedido()" style="cursor:pointer" />
                <img src="~/img/Stop.png" style="cursor:pointer" />        
            }
            else{
                <label>No se a agregado productos al pedido</label>
            }
        }                
    }
    <br />
    <a href="/Registros/ListaMesa"><img src="~/img/Atras.png" /></a>    
</body>
</html>